<template>
  <div>
    <el-dialog
      v-model="props.visible"
      title="生产单列表"
      width="70%"
      @close="handleCancel"
    >
      <el-form
        :model="queryParams"
        class="flex-box"
        ref="queryRef"
        :inline="true"
      >
        <div>
          <el-form-item label="生产单编码" prop="produceNo">
            <el-input
              v-model.trim="queryParams.produceNo"
              placeholder="请输入生产单编码"
              @keyup.enter="handleQuery"
            />
          </el-form-item>
          <el-form-item label="产品名称" prop="bookName">
            <el-input
              v-model.trim="queryParams.bookName"
              placeholder="请输入产品名称"
              @keyup.enter="handleQuery"
            />
          </el-form-item>
          <!-- <el-form-item label="出版编码" prop="pubNo">
            <el-input
              v-model.trim="queryParams.pubNo"
              placeholder="请输入出版编码"
              @keyup.enter="handleQuery"
            />
          </el-form-item> -->
          <el-form-item>
            <el-button type="primary" icon="Search" @click="handleQuery">
              搜索
            </el-button>
            <el-button icon="Refresh" @click="resetQuery">重置</el-button>
          </el-form-item>
        </div>
        <el-button
          type="primary"
          plain
          @click="handleSubmit"
          :disabled="multiple"
        >
          确认
        </el-button>
      </el-form>
      <el-row :gutter="20" style="overflow: auto">
        <el-col :span="24">
          <!-- -->
          <el-table
            ref="orderRef"
             height="65vh"
            v-loading="loading"
            :data="orderList"
            @row-click="handleClick"
            stripe
            border
            row-key="produceId"
            style="cursor: pointer"
            @selection-change="handleSelectionChange"
          >
            <el-table-column
              type="selection"
              :reserve-selection="true"
              width="55"
            />
            <el-table-column
              label="序号"
              width="60"
              type="index"
              align="center"
            />
            <el-table-column
              label="生产单编码"
              align="center"
              min-width="120"
              prop="produceNo"
            ></el-table-column>
            <el-table-column
              label="订单数量"
              align="center"
              min-width="80"
              prop="produceCount"
            ></el-table-column>
            <el-table-column
              label="剩余订单数量"
              align="center"
              min-width="100"
              prop="produceCountYu"
            ></el-table-column>
            
            <!-- <el-table-column
              label="出版编码"
              align="center"
              prop="pubNo"
            ></el-table-column>
            <el-table-column
              label="书刊编码"
              align="center"
              prop="pubNo"
            ></el-table-column> -->
            <el-table-column
              label="产品品种"
              align="center"
              min-width="70"
              prop="breedType"
            ></el-table-column>
            <el-table-column
              label="产品名称"
              min-width="320"
              align="center"
              prop="bookName"
            ></el-table-column>
          
            <!-- <el-table-column
              label="清样编号"
              align="center"
              prop="sampleNo"
            ></el-table-column>
            <el-table-column
              label="文件号"
              align="center"
              prop="fileNo"
            ></el-table-column>
            <el-table-column
              label="书号"
              align="center"
              prop="bookNo"
            ></el-table-column>
            <el-table-column
              label="定价"
              align="center"
              prop="fixPrice"
            ></el-table-column>
            <el-table-column
              label="组成"
              align="center"
              prop="composition"
            ></el-table-column>
            <el-table-column label="印色" align="center" prop="printColor">
              <template #default="scope">
                <dict-tag
                  :options="ems_order_print_color"
                  :value="scope.row.printColor"
                />
              </template>
            </el-table-column>
            <el-table-column label="颜色" align="center" prop="color">
              <template #default="scope">
                <dict-tag
                  :options="ems_produce_color"
                  :value="scope.row.color"
                />
              </template>
            </el-table-column>
            <el-table-column label="科目" align="center" prop="subjectType">
              <template #default="scope">
                <dict-tag
                  :options="ems_workshop_subject_type"
                  :value="scope.row.subjectType"
                />
              </template>
            </el-table-column> -->
            <el-table-column label="下单日期" align="center" prop="submitDate" min-width="70">
              <template #default="scope">
                {{ scope.row.submitDate?.split("T")[0] }}
              </template>
            </el-table-column>
          </el-table>
        </el-col>
      </el-row>
      <div class="footer">
        <pagination
          v-show="total > 0"
          :total="total"
          v-model:page="queryParams.pageNum"
          v-model:limit="queryParams.pageSize"
          @pagination="getList"
        />
      </div>
    </el-dialog>
  </div>
</template>

<script setup>
import { getProduceOrderList, listFm } from "@/api/production/cover";
const emit = defineEmits(["changeUpdate", "cancel"]);
const { proxy } = getCurrentInstance();
const {
  ems_order_print_color,
  ems_workshop_subject_type,
  ems_produce_color,
  mes_paper_specs,
  mes_paper_type,
  mes_paper_unit,
} = proxy.useDict(
  "mes_paper_unit",
  "mes_paper_type",
  "mes_paper_specs",
  "ems_workshop_subject_type",
  "ems_order_print_color",
  "ems_produce_color"
);

const props = defineProps({
  visible: {
    type: Boolean,
    default: false,
  },
  bookCode: {
    type: [Number, String],
    default: "",
  },
  // orderSelectList: {
  //   type: Array,
  //   default: () => {
  //     [];
  //   },
  // },
});

const orderRef = ref(null);
const orderList = ref([]);
const productList = ref([]);
const multiple = ref(true);
const selectRow = ref([]);
const produceList = ref([]);
const loading = ref(false);
const loadingInfo = ref(false);
const orderListTable = ref(null);
const queryParams = ref({
  pageNum: 1,
  pageSize: 10,
  // type: 1,
  // fmshym: 1,
  // status: 16,
  // state: 1,
});
watch(
  () => props.visible,
  (val) => {
    if (val) {
      if (props.bookCode) {
        queryParams.value.bookCode = props.bookCode;
      }
      getList();
      nextTick(() => {
        orderRef.value.clearSelection();
        // if (props.orderSelectList.length > 0) {
        //   props.orderSelectList.forEach((item) => {
        //     orderRef.value.toggleRowSelection(item, true);
        //   });
        // }
      });
    }
  }
);

const total = ref(0);

// 选中
const handleSelectionChange = (row) => {
  selectRow.value = row;
  multiple.value = !row.length;
};
// 选一个生产单
const handleSubmit = async () => {
  emit("changeUpdate", selectRow.value);
};
const handleCancel = () => {
  proxy.resetForm("queryRef");
  emit("cancel");
};

const handleClick = (row) => {
  orderRef.value.toggleRowSelection(row);
};

const getList = async () => {
  loading.value = true;
  const res = await listFm(queryParams.value);
  // res.rows.forEach((val, index) => {
  //   console.log(val.breedType);
  //   val.produceCount =
  //     val.produceCount != undefined && val.produceCount != ""
  //       ? val.produceCount.split(",")
  //       : null;
  //   val.breedType =
  //     val.breedType != undefined && val.breedType != ""
  //       ? val.breedType.split(",")
  //       : null;
  //   val.bookName =
  //     val.bookName != undefined && val.bookName != ""
  //       ? val.bookName.split(",")
  //       : null;
  //   val.bookNo =
  //     val.bookNo != undefined && val.bookNo != ""
  //       ? val.bookNo.split(",")
  //       : null;
  // });
  loading.value = false;
  orderList.value = res.rows;
  total.value = res.total;
};
// 搜索
const handleQuery = () => {
  queryParams.value.bookCode = undefined;
  queryParams.value.pageNum = 1;
  getList();
};
/** 重置按钮操作 */
const resetQuery = () => {
  proxy.resetForm("queryRef");
  handleQuery();
};

// getList()
</script>

<style lang="scss" scoped></style>
